﻿<%@ Page Language="C#" AutoEventWireup="true" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" style="height:100%;">
<head runat="server">
    <title>DBSchemaViewer.FrontEnd.Main</title>
    <style type="text/css">
    html, body {
	    height: 100%;
	    overflow: auto;
    }
    body {
	    padding: 0;
	    margin: 0;
    }
    #silverlightControlHost {
	    height: 100%;
	    text-align:center;
    }
    </style>
    
    
    <script type="text/javascript" src="Silverlight.js"></script>
    <script type="text/javascript">
        function onSilverlightError(sender, args) {
            var appSource = "";
            if (sender != null && sender != 0) {
                appSource = sender.getHost().Source;
            }

            var errorType = args.ErrorType;
            var iErrorCode = args.ErrorCode;

            if (errorType == "ImageError" || errorType == "MediaError") {
                return;
            }

            var errMsg = "Unhandled Error in Silverlight Application " + appSource + "\n";

            errMsg += "Code: " + iErrorCode + "    \n";
            errMsg += "Category: " + errorType + "       \n";
            errMsg += "Message: " + args.ErrorMessage + "     \n";

            if (errorType == "ParserError") {
                errMsg += "File: " + args.xamlFile + "     \n";
                errMsg += "Line: " + args.lineNumber + "     \n";
                errMsg += "Position: " + args.charPosition + "     \n";
            }
            else if (errorType == "RuntimeError") {
                if (args.lineNumber != 0) {
                    errMsg += "Line: " + args.lineNumber + "     \n";
                    errMsg += "Position: " + args.charPosition + "     \n";
                }
                errMsg += "MethodName: " + args.methodName + "     \n";
            }

            throw new Error(errMsg);
        }
    </script>       
</head>

<script type="text/javascript">
    // YOU WILL NEED TO COPY THIS SCRIPT TO YOUR ASP .net / HTML page
    // basic initialization plus instantiation
    // this flag will indicate us whether the viewer is ready (downloaded and running)
    var viewer_Loaded = false;
    var slCtl = null;


    // -- This method is called by the SL application to notify the HTML page that the application
    // has been download and is ready to run and receive commands
    /// Just when the SL ctl is loaded this event is fired
    /// For the ASP .net version
    ///
    //    function pluginLoaded(sender) {    // ASPX version
    //        slCtl = sender.get_element();
    //        alert(slCtl.Content.mySLapp.MyToUpper("Test String"));
    //    }    
    function pluginLoaded(sender, args) {      // HTML version
        viewer_Loaded = true;
        slCtl = sender.getHost();


        LoadDiagramIntoDBSchemaViewer();

    }



    // Based on:
    // http://www.mostlydevelopers.com/mostlydevelopers/blog/post/2008/08/11/Call-Javascript-Method-from-Silverlight-and-Vice-Versa.aspx

    function GetPluginInstance() {
        var pluginInstance = null;


        if (viewer_Loaded == true) {
            pluginInstance = slCtl.Content.plDBSchemaViewer;
        }

        return pluginInstance
    }


    function LoadDiagramIntoDBSchemaViewer() {
        // XML Diagram to show
        var sampleXML = '<root>    <header>      <canvassize x="2048" y="1800" scalefactor="1" />      <idseed lastid="117" />      <dbengine type="SQLSERVER" />    </header>    <body>      <tables>        <table id="1" posx="1188,99967441294" posy="79,666618347168">          <name>Categories</name>          <fields>            <field id="2">              <name>CategoryID</name>              <type>4</type>              <length>-1</length>              <pk>true</pk>              <fk>false</fk>            </field>            <field id="3">              <name>CategoryName</name>              <type>5</type>              <length>15</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="4">              <name>Description</name>              <type>6</type>              <length>-1</length>              <pk>False</pk>              <fk>False</fk>            </field>          </fields>        </table>        <table id="5" posx="1230,99975585938" posy="951,000528905127">          <name>CustomerDemoCustomerDemo</name>          <fields>            <field id="6">              <name>CustomerID</name>              <type>4</type>              <length>-1</length>              <pk>true</pk>              <fk>True</fk>            </field>            <field id="7">              <name>CustomerTypeID</name>              <type>4</type>              <length>-1</length>              <pk>false</pk>              <fk>True</fk>            </field>          </fields>        </table>        <table id="8" posx="1230,33337402344" posy="1115,33268222544">          <name>CustomerDemographics</name>          <fields>            <field id="9">              <name>CustomerTypeID</name>              <type>4</type>              <length>-1</length>              <pk>true</pk>              <fk>false</fk>            </field>            <field id="10">              <name>CustomerDesc</name>              <type>6</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>          </fields>        </table>        <table id="11" posx="1229,66625976563" posy="593,000101659033">          <name>Customers</name>          <fields>            <field id="12">              <name>CustomerID</name>              <type>4</type>              <length>-1</length>              <pk>true</pk>              <fk>false</fk>            </field>            <field id="13">              <name>CompanyName</name>              <type>5</type>              <length>40</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="14">              <name>ContactName</name>              <type>5</type>              <length>30</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="15">              <name>ContactTitle</name>              <type>5</type>              <length>30</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="16">              <name>Address</name>              <type>5</type>              <length>60</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="17">              <name>City</name>              <type>5</type>              <length>15</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="18">              <name>Region</name>              <type>5</type>              <length>15</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="19">              <name>PostalCode</name>              <type>5</type>              <length>10</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="20">              <name>Country</name>              <type>5</type>              <length>15</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="21">              <name>Phone</name>              <type>5</type>              <length>24</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="22">              <name>Fax</name>              <type>5</type>              <length>24</length>              <pk>false</pk>              <fk>false</fk>            </field>          </fields>        </table>        <table id="23" posx="839,66650390625" posy="1213,00020351675">          <name>Shippers</name>          <fields>            <field id="24">              <name>ShipperID</name>              <type>4</type>              <length>-1</length>              <pk>true</pk>              <fk>false</fk>            </field>            <field id="25">              <name>CompanyName</name>              <type>5</type>              <length>40</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="26">              <name>Phone</name>              <type>5</type>              <length>24</length>              <pk>false</pk>              <fk>false</fk>            </field>          </fields>        </table>        <table id="33" posx="442,333394434717" posy="630,667236328125">          <name>Employees</name>          <fields>            <field id="34">              <name>EmployeeID</name>              <type>4</type>              <length>-1</length>              <pk>true</pk>              <fk>false</fk>            </field>            <field id="35">              <name>LastName</name>              <type>5</type>              <length>20</length>              <pk>False</pk>              <fk>False</fk>            </field>            <field id="36">              <name>FirstName</name>              <type>5</type>              <length>10</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="37">              <name>Title</name>              <type>5</type>              <length>30</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="38">              <name>TitleOfCourtesy</name>              <type>5</type>              <length>25</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="39">              <name>BirthDate</name>              <type>2</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="40">              <name>HireDate</name>              <type>2</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="41">              <name>Address</name>              <type>5</type>              <length>60</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="42">              <name>City</name>              <type>5</type>              <length>15</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="43">              <name>Region</name>              <type>5</type>              <length>15</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="44">              <name>PostalCode</name>              <type>5</type>              <length>10</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="45">              <name>Country</name>              <type>5</type>              <length>15</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="46">              <name>HomePhone</name>              <type>5</type>              <length>24</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="47">              <name>Extension</name>              <type>5</type>              <length>4</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="48">              <name>PhotoLink</name>              <type>5</type>              <length>255</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="49">              <name>Notes</name>              <type>6</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="50">              <name>ReportsTo</name>              <type>4</type>              <length>-1</length>              <pk>false</pk>              <fk>True</fk>            </field>            <field id="51">              <name>PhotoPath</name>              <type>6</type>              <length>255</length>              <pk>false</pk>              <fk>false</fk>            </field>          </fields>        </table>        <table id="53" posx="448,666493799951" posy="423,000244140625">          <name>EmployeeTerritories</name>          <fields>            <field id="54">              <name>EmployeeID</name>              <type>4</type>              <length>-1</length>              <pk>true</pk>              <fk>True</fk>            </field>            <field id="55">              <name>TerritoryID</name>              <type>5</type>              <length>20</length>              <pk>false</pk>              <fk>True</fk>            </field>          </fields>        </table>        <table id="56" posx="88,0000101062987" posy="849,333618164063">          <name>Region</name>          <fields>            <field id="57">              <name>RegionID</name>              <type>4</type>              <length>-1</length>              <pk>true</pk>              <fk>false</fk>            </field>            <field id="58">              <name>RegionDescription</name>              <type>5</type>              <length>50</length>              <pk>false</pk>              <fk>false</fk>            </field>          </fields>        </table>        <table id="59" posx="826,833068847656" posy="380,166534647346">          <name>Suppliers</name>          <fields>            <field id="60">              <name>SupplierID</name>              <type>4</type>              <length>-1</length>              <pk>true</pk>              <fk>false</fk>            </field>            <field id="61">              <name>CompanyName</name>              <type>5</type>              <length>40</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="62">              <name>ContactName</name>              <type>5</type>              <length>30</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="63">              <name>ContactTitle</name>              <type>5</type>              <length>30</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="64">              <name>Address</name>              <type>5</type>              <length>60</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="65">              <name>City</name>              <type>5</type>              <length>15</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="66">              <name>Region</name>              <type>5</type>              <length>15</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="67">              <name>PostalCode</name>              <type>5</type>              <length>10</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="68">              <name>Coutnry</name>              <type>5</type>              <length>15</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="69">              <name>Phone</name>              <type>5</type>              <length>24</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="70">              <name>Fax</name>              <type>5</type>              <length>24</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="71">              <name>HomePage</name>              <type>6</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>          </fields>        </table>        <table id="72" posx="829,166748046875" posy="769,998779520392">          <name>Orders</name>          <fields>            <field id="73">              <name>OrderID</name>              <type>4</type>              <length>-1</length>              <pk>true</pk>              <fk>false</fk>            </field>            <field id="74">              <name>CustomerID</name>              <type>4</type>              <length>-1</length>              <pk>false</pk>              <fk>True</fk>            </field>            <field id="75">              <name>EmployeeID</name>              <type>4</type>              <length>-1</length>              <pk>False</pk>              <fk>True</fk>            </field>            <field id="76">              <name>OrderDate</name>              <type>2</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="77">              <name>RequiredDate</name>              <type>2</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="78">              <name>ShippedDate</name>              <type>2</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="79">              <name>ShipVia</name>              <type>4</type>              <length>-1</length>              <pk>false</pk>              <fk>True</fk>            </field>            <field id="80">              <name>Freight</name>              <type>3</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="81">              <name>ShipName</name>              <type>5</type>              <length>40</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="82">              <name>ShipAddress</name>              <type>5</type>              <length>60</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="83">              <name>ShipCity</name>              <type>5</type>              <length>15</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="84">              <name>ShipRegion</name>              <type>5</type>              <length>15</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="85">              <name>ShipPostalCode</name>              <type>5</type>              <length>10</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="86">              <name>ShipCountry</name>              <type>5</type>              <length>15</length>              <pk>false</pk>              <fk>false</fk>            </field>          </fields>        </table>        <table id="93" posx="81,9999822643068" posy="639,630065917969">          <name>Territories</name>          <fields>            <field id="94">              <name>TerritoryID</name>              <type>5</type>              <length>20</length>              <pk>true</pk>              <fk>false</fk>            </field>            <field id="95">              <name>TerritoryDescription</name>              <type>5</type>              <length>50</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="96">              <name>RegionID</name>              <type>4</type>              <length>-1</length>              <pk>False</pk>              <fk>True</fk>            </field>          </fields>        </table>        <table id="97" posx="824,333048436377" posy="19,9444580078125">          <name>Products</name>          <fields>            <field id="98">              <name>ProductID</name>              <type>4</type>              <length>-1</length>              <pk>true</pk>              <fk>false</fk>            </field>            <field id="99">              <name>ProductName</name>              <type>5</type>              <length>40</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="100">              <name>SupplierID</name>              <type>4</type>              <length>-1</length>              <pk>false</pk>              <fk>True</fk>            </field>            <field id="101">              <name>CategoryID</name>              <type>4</type>              <length>-1</length>              <pk>false</pk>              <fk>True</fk>            </field>            <field id="102">              <name>QuantityPerUnit</name>              <type>5</type>              <length>20</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="103">              <name>UnitPrice</name>              <type>3</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="104">              <name>UnitsInStock</name>              <type>4</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="105">              <name>UnitsInOrder</name>              <type>4</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="106">              <name>ReorderLevel</name>              <type>4</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="107">              <name>Discontinued</name>              <type>1</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>          </fields>        </table>        <table id="27" posx="435,666839599609" posy="70,6666564941406">          <name>OrderDetails</name>          <fields>            <field id="28">              <name>OrderID</name>              <type>4</type>              <length>-1</length>              <pk>true</pk>              <fk>True</fk>            </field>            <field id="29">              <name>ProductID</name>              <type>4</type>              <length>-1</length>              <pk>true</pk>              <fk>true</fk>            </field>            <field id="30">              <name>UnitPrice</name>              <type>3</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="31">              <name>Quantity</name>              <type>4</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>            <field id="32">              <name>Discount</name>              <type>4</type>              <length>-1</length>              <pk>false</pk>              <fk>false</fk>            </field>          </fields>        </table>      </tables>      <relations>        <relation id="87">          <tablefromid>8</tablefromid>          <tabletoid>5</tabletoid>          <fieldsmapping>            <fieldmapping fieldfromid="9" fieldtoid="7" />          </fieldsmapping>        </relation>        <relation id="88">          <tablefromid>11</tablefromid>          <tabletoid>72</tabletoid>          <fieldsmapping>            <fieldmapping fieldfromid="12" fieldtoid="74" />          </fieldsmapping>        </relation>        <relation id="89">          <tablefromid>23</tablefromid>          <tabletoid>72</tabletoid>          <fieldsmapping>            <fieldmapping fieldfromid="24" fieldtoid="79" />          </fieldsmapping>        </relation>        <relation id="92">          <tablefromid>33</tablefromid>          <tabletoid>72</tabletoid>          <fieldsmapping>            <fieldmapping fieldfromid="34" fieldtoid="75" />          </fieldsmapping>        </relation>        <relation id="108">          <tablefromid>1</tablefromid>          <tabletoid>97</tabletoid>          <fieldsmapping>            <fieldmapping fieldfromid="2" fieldtoid="101" />          </fieldsmapping>        </relation>        <relation id="109">          <tablefromid>97</tablefromid>          <tabletoid>27</tabletoid>          <fieldsmapping>            <fieldmapping fieldfromid="98" fieldtoid="29" />          </fieldsmapping>        </relation>        <relation id="110">          <tablefromid>59</tablefromid>          <tabletoid>97</tabletoid>          <fieldsmapping>            <fieldmapping fieldfromid="60" fieldtoid="100" />          </fieldsmapping>        </relation>        <relation id="111">          <tablefromid>72</tablefromid>          <tabletoid>27</tabletoid>          <fieldsmapping>            <fieldmapping fieldfromid="73" fieldtoid="28" />          </fieldsmapping>        </relation>        <relation id="112">          <tablefromid>93</tablefromid>          <tabletoid>53</tabletoid>          <fieldsmapping>            <fieldmapping fieldfromid="94" fieldtoid="55" />          </fieldsmapping>        </relation>        <relation id="114">          <tablefromid>56</tablefromid>          <tabletoid>93</tabletoid>          <fieldsmapping>            <fieldmapping fieldfromid="57" fieldtoid="96" />          </fieldsmapping>        </relation>        <relation id="115">          <tablefromid>33</tablefromid>          <tabletoid>53</tabletoid>          <fieldsmapping>            <fieldmapping fieldfromid="34" fieldtoid="54" />          </fieldsmapping>        </relation>        <relation id="116">          <tablefromid>33</tablefromid>          <tabletoid>33</tabletoid>          <fieldsmapping>            <fieldmapping fieldfromid="34" fieldtoid="50" />          </fieldsmapping>        </relation>        <relation id="117">          <tablefromid>11</tablefromid>          <tabletoid>5</tabletoid>          <fieldsmapping>            <fieldmapping fieldfromid="12" fieldtoid="6" />          </fieldsmapping>        </relation>      </relations>    </body>  </root>';


        var pluginInstance = GetPluginInstance()

        if (pluginInstance)
            pluginInstance.LoadXMLContentIntoDBSchemaViewer(sampleXML);

    }


    function ZoomIn() {

        var pluginInstance = GetPluginInstance()

        if (pluginInstance)
            pluginInstance.ExecuteZoomOperation(true);
    }

    function ZoomOut() {
        var pluginInstance = GetPluginInstance()

        if (pluginInstance)
            pluginInstance.ExecuteZoomOperation(false);

    }

    //Call to the Silverlight method that export the main Canvas
    function ExportImage() {
        var pluginInstance = GetPluginInstance()
        pluginInstance.ExecuteExportImage();
    }
    
</script>

<body>
    <form id="form1" runat="server" style="height:100%">
        <!-- Zoom in, Zoom out buttons, crappy but simple :) -->               
        <table width="100%">
            <tr>
                <td>
                    <input type="button" value="Zoom In" onclick="ZoomIn();" />              
                    <input type="button" value="Zoom Out" onclick="ZoomOut();" 
                        style="margin-left: 0px" />
                </td>   
                <td align="right">
                    <input type="button" onclick="ExportImage();" value="Export Image"/>
                </td>             
            </tr>
        </table>
    
    <div id="silverlightControlHost">
        <object id="plugin" data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
		  <param name="source" value="ClientBin/DBSchemaViewer.FrontEnd.Main.xap"/>
		  <param name="onError" value="onSilverlightError" />
		  <param name="background" value="white" />
		  <param name="minRuntimeVersion" value="3.0.40624.0" />
		  <param name="autoUpgrade" value="true" />
		  <param name="onLoad" value="pluginLoaded" />
		  <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40624.0" style="text-decoration:none">
 			  <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style:none"/>
		  </a>
	    </object><iframe id="_sl_historyFrame" style="visibility:hidden;height:0px;width:0px;border:0px"></iframe>
   </div>
    </form>
</body>
</html>